<template id="collage">
	<div class="collage">

		<div class="collage_header">课程预约</div>

		<div class="super">
			<div class="collage_super">
				<span>{{courseName}}</span>
				<img src="../../assets/images/collage/collage_jian_03.png" @click.stop="toggle" />
			</div>
			<div class="collage_brief" v-show='courseActive'>
				<ul>
					<li @click="haha(todos)" v-for="todos in course">{{todos.gym_name}}</li>
				</ul>
			</div>

		</div>
		
		<!--瑜伽馆信息-->
		<div class="collage_make">
           <ul>
           <li v-for="(item,index) in most" :key = "index" @click.stop="courseArr(item.id)">
           <div class="collage_li">
           <dl>
           <dt>
           <img v-lazy="item.photo"/>
           </dt>
            <dd>
            <p>{{item.gym_name}}</p>
           
            <div class="xing">
             <div class="collage_xing">
                    <el-rate v-model="item.level" disabled>
		
		</el-rate>
                  </div>
            </div>
            <div class="collage_run">{{item.start}}km</div>
            <div class="collage_price">
            	<span>￥49</span><font>起</font>
            </div>
            
            
            </dd>
           </dl>
          
           
            </div>
           </li>

           </ul>
           </div>
           
           <!--瑜伽馆信息结束-->

		<!-- <v-footer></v-footer> -->
		<div class="footer_router">

			<ul>
				<li @click="HeightL(0)">
					<router-link to="/about_class">
						<img v-if="index=='1'||index=='2'" src="../../assets/images/footer_icon/yueke_gray.png" />
						<img v-if="index=='0'" src="../../assets/images/footer_icon/yueke_green.png" />
						<p>约课</p>
					</router-link>
				</li>
				<li @click="HeightL(1)" @click.stop="collageAdd">
					<router-link to="/collage">
						<img v-if="index=='0'||index=='2'" src="../../assets/images/footer_icon/dingdan_gray.png" />
						<img v-if="index=='1'" src="../../assets/images/footer_icon/dingdan_green.png" />
						<p>拼团</p>
					</router-link>
				</li>
				<li @click="HeightL(2)" @click.stop="userAdd">
					<router-link to="/main">
						<img v-if="index=='1'||index=='0'" src="../../assets/images/footer_icon/me_gray.png" />
						<img v-if="index=='2'" src="../../assets/images/footer_icon/me_green.png" />

						<p>我的</p>
					</router-link>
				</li>
			</ul>

		</div>
	</div>
</template>
<script>
	// import footer from '@/components/footer'
	export default {
		name: 'App',
		components: {
			// "v-footer":footer
		},
		data() {
			return {
				courseActive: false,				
				courseName: '',
				dataMoney: '',
				course: [{
					gym_name: ''
				}],
				index: '1',
				id:'',
				most:[]
			}
		},
		created(){
			let _this = this
			let qs = require('qs');

			_this.lng = window.localStorage.getItem('lng');
			_this.lat = window.localStorage.getItem('lat');
			let obj = {
				//请求的参数
				lng: _this.lng,
				lat: _this.lat,
				  // datetime:times,
              datetime:'2018-10-19',

			};

			_this.$axios.post("/yujiaextend/user/findGymByGps", qs.stringify(obj), {
				headers: {
					'Content-Type': 'application/x-www-form-urlencoded'
				}

			}).then(function(response) {		
				_this.most = response.data.data
				// console.log(response.data.data[0].id)
				_this.id = response.data.data[0].id
				_this.course = response.data.data
				_this.courseName = _this.course[0].gym_name;
				

			}).catch(function(error) {
				console.log(error);
			});
			
		},


		
		methods: {
			HeightL: function(index) {
				this.index = index
			},
			haha(item) {
				this.courseName = item.gym_name
				this.courseActive = false
			},
			toggle() {
				this.courseActive = !this.courseActive
			},
			
			
			collageAdd() {
				var SESSION_ID = JSON.parse(window.localStorage.getItem('sessiond'))
				if(SESSION_ID == null) {
					mui.alert('请登录')
					var collage
					this.$router.push({

						path: "/forgot_password",
						query: {
							collage: 'collage'
						}
					})
				} else {
					this.$router.push({
						path: '/collage'
					})
				}
			},
			userAdd() {
				var SESSION_ID = JSON.parse(window.localStorage.getItem('sessiond'))
				if(SESSION_ID == null) {
					mui.alert('请登录')
					var main
					this.$router.push({

						path: "/forgot_password",
						query: {
							main: 'main'
						}
					})
				} else {
					this.$router.push({
						path: '/main'
					})
				}
			},

			courseArr(gym_id){
				this.$router.push({
					path:'/collage_class',
					query:{
						gym_id,
					}
				})
			}

		}
	}
</script>
<style>
	.collage_xing .el-rate__item {
		width: 14px;
		margin-top: 2px;
		margin-left:4px;
		
	}
	.collage_xing .el-rate__item:first-child{
		margin-left: 0;
	}
	.collage_xing .el-rate__icon {
		font-size: 14px;
		background: #2d8f90;
		padding: 1px 1px;
		border-radius: 2px;
	}
	
	.el-rate__icon .el-icon-star-on:before {
		width: 14px;
		height: 14px;
	}
	 .router-link-active {
		color: #2D8F90;
	}
</style>
<style scoped>
	@import "../../assets/css/collage.css";
	@import "../../assets/css/footer_router.css";
	
</style>

